<!-- 日记详情 -->
<template>
    <div class="diary-detail">
         <nut-navbar :rightShow="false">
            <span>日记详情</span>
            <a slot="back-icon" @click="goBack">返回</a>
        </nut-navbar>
        <div class="diary-content">
            <div class="title">{{ diaryDetail.title }}</div>
            <div class="content" v-html="diaryDetail.diary"></div>
            <div class="time">{{ diaryDetail.addTime }}</div>
        </div>
    </div>
</template>

<script>

import { API_DetailDiary } from "@/api/diary"

export default {
    data() {
        return {
            diaryDetail: {}
        }
    },
    created() {
        this.getDiaryDetail()
    },
    mounted() {

    },
    computed: {

    },
    methods: {
        // 返回
        goBack() {
            this.$router.back()
        },
        // 获取日记详情
        getDiaryDetail() {
            API_DetailDiary({
                diary_id: this.$route.query.diaryId
            }).then(res => {
                if(res.data.code === 0) {
                    this.diaryDetail = res.data.result;
                }
            })
        }
    }
}
</script>

<style lang="scss" scoped>
    .diary-detail {
        width: 100%;
        height: 100%;
        position: relative;
        overflow: hidden;
        .diary-content {
            width: 100%;
            position: absolute;
            top: 40px;
            bottom: 0;
            text-align: left;
            padding: 10px;
            .title {
                margin-bottom: 10px;
                text-align: center;
                font-weight: bold;
            }
            .time {
                margin-top: 50px;
                text-align: right;
            }
        }
    }
</style>